import { createRouter, createWebHistory } from 'vue-router'
import HomeView from '../views/HomeView.vue'

const router = createRouter({
  history: createWebHistory(import.meta.env.BASE_URL),
  routes: [
    {
      path: '/',
      name: 'main',
      component: () => import('../views/MainView.vue'),
      children: [
        {
          path: '/',
          name: 'mainDefault',
          component: () => import('../components/main/content/MainView.vue'),
          alias: ['/main']
        },
        {
          path: '/login',
          name: 'login',
          component: () => import('../components/main/content/LoginView.vue'),
          children: [
            {
              path: '/login/TelAndPwdForm',
              name: 'TelAndPwdForm',
              alias: ['/login'],
              component: () => import('../components/login/TelAndPwdForm.vue')
            },
            {
              path: '/login/TelAndSms',
              name: 'TelAndSms',
              component: () => import('../components/login/TelAndSmsForm.vue')
            }
          ]
        },
        {
          path: '/production',
          name: 'production',
          component: () => import('../components/main/content/ProductionView.vue')
        },
        {
          path: '/instance',
          name: 'instance',
          component: () => import('../components/main/content/InstanceView.vue')
        },
        {
          path: '/register',
          name: 'register',
          component: () => import('../components/main/content/RegisterView.vue')
        }
      ]
    },
    {
      path: '/home',
      name: 'home',
      component: HomeView,
      children: [
        {
          path: '/home',
          name: 'homeMain',
          component: () => import('../components/home/WelcomeView.vue')
        },
        {
          path: '/home/role',
          name: 'role',
          component: () => import('../views/RoleView.vue')
        },
        {
          path: '/home/member',
          name: 'member',
          component: () => import('../views/MemberView.vue')
        },
        {
          path: '/home/grider',
          name: 'grider',
          component: () => import('../views/GriderView.vue')
        },
        {
          path: '/home/dataReport',
          name: 'dataReport',
          component: () => import('../views/ReportView.vue')
        },
        {
          path: '/home/historyRecord',
          name: 'historyRecord',
          component: () => import('../views/HistoryRecord.vue')
        },
        {
          path: '/home/taskAssignment',
          name: 'taskAssignment',
          component: () => import('../views/TaskAssignment.vue')
        },
        {
          path: '/home/taskList',
          name: 'taskList',
          component: () => import('../views/TaskList.vue')
        },
        {
          path: '/home/currentTasks',
          name: 'currentTasks',
          component: () => import('../views/CurrentTask.vue')
        },
        {
          path: '/home/statistics',
          name: 'statistics',
          component: () => import('../views/StatisticView.vue')
        },
        {
          path: '/home/historyTasks',
          name: 'historyTasks',
          component: () => import('../views/HistoryTask.vue')
        },
        {
          path: '/home/myInformation',
          name: 'MyInformation',
          component: () => import('../views/ModifyInformation.vue')
        },
        {
          path: '/home/grid',
          name: 'grid',
          component: () => import('../components/home/GridView.vue')
        }
      ]
    },
    {
      path: '/about',
      name: 'about',
      // route level code-splitting
      // this generates a separate chunk (About.[hash].js) for this route
      // which is lazy-loaded when the route is visited.
      component: () => import('../views/AboutView.vue')
    },
    {
      path: '/home/dataScreen',
      name: 'DataScreen',
      component: () => import('../views/DataScreen.vue')
    }
  ]
})

export default router
